<template>
  <div>
    <!--    操作台-->
    <regulate
      v-if="this.item == 'Mi' || this.item == 'Ma' || this.item == 'Xi' || this.item == 'Te' || this.item == 'Zh'"
      :Midata="control"
      :situation="this.$route.query.situation"
      :processStatus="this.$route.query.processStatus"
      :caozuo="this.$route.query.caozuo"
      :item="item"
      :type="type"
      :id="id"
      :yaTitle="yaTitle"
    />
    <!--    简述-->
    <summaryM
      v-if="this.item == 'Mi' || this.item == 'Ma' || this.item == 'Xi' || this.item == 'Te' || this.item == 'Zh'"
      :Midata="control"
      :item="item"
      :type="type"
      :id="id.toString()"
    />
    <!--    嫌疑人-->
    <suspicion
      v-if="item == 'Mi'"
      :Midata="suspect" />
    <!--    受害人-->
    <afflicted
      v-if="item == 'Mi'"
      :Midata="victim" />
    <!--矛盾标签页-->
    <listMa
      v-if="item == 'Ma'"
      :id="this.id" :party="party"
      :resolution="resolution"
      @huajie="huajie"
      :bj="this.pass"
    />
    <!--    线路标签页-->
    <listXi
      v-if="item == 'Xi'"
      :id="this.id"
      :party="party"
      :resolution="resolution"
      @update="update"/>

    <!--    师生标签页-->
    <listXi
      v-if="item == 'Te'"
      :id="this.id"
      :party="party"
      :resolution="resolution"/>
    <!--    审批进度-->
    <approve
      v-if="item == 'Mi' || this.item == 'Ma' || this.item == 'Xi' || this.item == 'Te' || this.item == 'Zh'"
      :Midata="nodeVOS"
    />
    <div v-if="planse !== undefined">
<!--      {{this.planse}}-->
      <Box>
        <div slot="box">
          <a-tabs default-active-key="1">
            <a-tab-pane key="1" tab="预案信息">
<!--              {{this.planse.details}}-->
              <div>
                <span style="font-weight: 500;font-size: 25px;margin-right: 15px;color: black">{{ this.planse.details.name }}</span>
                <a-tag color="red">
                  {{ this.planse.details.planCategory }}
                </a-tag>
                <div style="margin-top: 15px">
                  <span>编辑日期：{{ this.planse.details.editTime }}</span>
                  &emsp;&emsp;&emsp;
                  <span>编辑人：{{ this.planse.details.createBy }}</span>
                </div>
              </div>
              <div style="margin-top: 50px">
                <span style="font-weight: 500;font-size: 20px;margin-right: 15px">预案措施</span>
                <p class="box" style="font-size: 1.1rem;text-indent: 1.1rem">{{ this.planse.details.measures }}</p>
              </div>
              <div style="margin-top: 50px">
                <span style="font-weight: 500;font-size: 20px;margin-right: 15px">预案流程</span>
                <p class="box" style="font-size: 1.1rem;text-indent: 1.1rem">{{ this.planse.details.technologicalProcess }}</p>
              </div>
              <div style="margin-top: 50px">
                <span style="font-weight: 500;font-size: 20px;margin-right: 15px;margin-bottom: 20px">参与人员</span>
                <a-table :columns="columns1" :data-source="this.planse.details.planUsers">

                </a-table>
              </div>
            </a-tab-pane>
            <a-tab-pane key="2" tab="审批进度" force-render>
              <approve
                :Midata="this.planse.nodeVo"
              />
<!--              <div style="box-sizing: border-box;padding: 10px">-->
<!--                <a-steps :current="this.planse.nodeVo.length">-->
<!--                  <a-popover slot="progressDot" slot-scope="{ index, status, prefixCls }">-->
<!--                    <template slot="content">-->
<!--                      <span>step {{ index }} status: {{ status }}</span>-->
<!--                    </template>-->
<!--                    <span :class="`${prefixCls}-icon-dot`" />-->
<!--                  </a-popover>-->
<!--                  &lt;!&ndash;          <a-step title="发起人">&ndash;&gt;-->
<!--                  &lt;!&ndash;            <div slot="description">{{ this.planse.nodeVo[0].approverName }}</div>&ndash;&gt;-->
<!--                  &lt;!&ndash;            <div slot="description">{{ this.planse.nodeVo[0].createTime }}</div>&ndash;&gt;-->
<!--                  &lt;!&ndash;          </a-step>&ndash;&gt;-->
<!--                  <a-step v-for="(item, index) in this.planse.nodeVo" :title="item.nodeName" style="display: flex" :key="index">-->
<!--                    <template v-if="index = 1">-->
<!--                      <div slot="description">{{ item.approverName }}</div>-->
<!--                      <div :style="item.statusName == '驳回' ? 'color:red' : 'color:#53C41B'" slot="description">-->
<!--                        {{ item.statusName }}-->
<!--                      </div>-->
<!--                      <div-->
<!--                        v-if="item.status != '通过' || item.status == '未到审批' || item.status == '待审批'"-->
<!--                        slot="description"-->
<!--                      >-->
<!--                        审批原因：{{ item.remark }}-->
<!--                      </div>-->
<!--                      <div slot="description">{{ item.approverTime }}</div>-->
<!--                      <div slot="description" v-if="item.nodeName == '发起人'">{{ item.createTime }}</div>-->
<!--                    </template>-->
<!--                  </a-step>-->
<!--                </a-steps>-->
<!--              </div>-->
            </a-tab-pane>
          </a-tabs>
        </div>
      </Box>
    </div>
  </div>
</template>

<script>
import Box from '@views/xlgc/Box'
// 受害人组件
import afflicted from '@/views/xlgc/lawCase/LifeCase/details/afflicted'
// 嫌疑人
import suspicion from '@/views/xlgc/lawCase/LifeCase/details/suspicion'
// 审批
import approve from '@/views/xlgc/lawCase/LifeCase/details/approve'
// 操作
import regulate from '@/views/xlgc/lawCase/LifeCase/details/regulate'
// 简要情况
import summaryM from '@/views/xlgc/lawCase/LifeCase/details/summaryM'
// 矛盾标签页
import listMa from '@/views/xlgc/lawCase/LifeCase/details/listMa'
// 线路标签页
import listXi from '@views/xlgc/lawCase/LifeCase/details/listXi'

import { getMAdetailed, getdataDet, getXLdata, getTexiang, updataZDsb, getZDxaing, updataTeli } from '@api/xlgc/lawCase'
import { getDictItemsFromCache } from '@api/api'
import {getPlan} from "@api/xlgc/plan";

export default {
  name: 'Detailed',
  components: { Box, afflicted, summaryM, approve, regulate, suspicion, listMa, listXi },
  data() {
    return {
      getdata: {},
      item: '',
      id: '',
      type: undefined,

      Midata: {},
      control: {},
      suspect: {},
      victim: {},
      nodeVOS: {},
      party: '',
      resolution: '',
      planse:undefined,
      columns1: [
        {
          title: '部门',
          dataIndex: 'department',
          scopedSlots: { customRender: 'department' }
        },
        {
          title: '姓名',
          dataIndex: 'name',

          scopedSlots: { customRender: 'name' }
        },
        {
          title: '职务',
          dataIndex: 'duties',

          scopedSlots: { customRender: 'duties' }
        },
        {
          title: '负责内容',
          dataIndex: 'responsibleContent',
          scopedSlots: { customRender: 'responsibleContent' }
        }
      ],
      pass: true,
      yaTitle:undefined
    }
  },
  mounted() {
    this.item = this.$route.query.item
    console.log(this.item)
    this.id = this.$route.query.id
    console.log(this.id)
    if(this.$route.query.bj === 'false'){
      this.pass = false
    }

    if(this.$route.query.title){
      this.yaTitle = this.$route.query.title
    }
    this.getData()
    // let data = {
    //   "id":this.$route.query.code
    // }
    if(this.item == 'Mi') this.type = '命案防控'
    if(this.item == 'Ma') this.type = '矛盾纠纷'
    if(this.item == 'Xi') this.type = '线路案事件'
    if(this.item == 'Te') this.type = '师生安全案事件'
    if(this.item == 'Zh') this.type = '重特大案事件'
    this.getPlan({
      eventId:this.id,
      eventType:this.type
    })
  },
  watch: {
    $route(data) {
      // data为当前路由信息
      this.item = data.query.item
      console.log(this.item)
      this.id = data.query.id
      console.log(this.id)
      this.getData()
    }
  },
  methods: {
    getData() {
      if (this.item == 'Mi') {
        this.institutionR({ id: this.id })
      }
      if (this.item == 'Ma') {
        this.institutionD(this.id)
      }
      if (this.item == 'Xi') {
        this.institutionX(this.id)
      }
      if (this.item == 'Te') {
        this.institutionT(this.id)
      }
      if (this.item == 'Zh') {
        this.institutionZ({ id: this.id, type: '重特大案事件' })

      }
    },
    huajie(val) {
      if (val) {
        this.institutionD(this.id)
      }
    },
    update(val) {
      if (val) {
        this.institutionX(this.id)
      }
    },
    getPlan(val){
      return new Promise((resolve, reject) => {
        getPlan(val)
          .then(response => {
            console.log(response)
            if(response.success){
              this.planse = response.result
            }
          })
          .catch(error => {
            // reject(error)
            console.log(error)
          })
      })
    },
    institutionR(val) {
      return new Promise((resolve, reject) => {
        getMAdetailed(val)
          .then(response => {
            console.log(val)
            this.control = response.result.control
            this.nodeVOS = response.result.nodeVOS
            this.suspect = response.result.suspect
            this.victim = response.result.victim
            console.log(response)
            resolve(response)
            console.log(response)
          })
          .catch(error => {
            reject(error)
          })
      })
    },
    institutionD(val) {
      return new Promise((resolve, reject) => {
        getdataDet(val)
          .then(response => {
            console.log(response)
            this.control = response.result.disputes
            this.nodeVOS = response.result.nodeVOS
            this.party = response.result.party
            this.resolution = response.result.resolution
            console.log(response)
            resolve(response)
            console.log(response)
          })
          .catch(error => {
            reject(error)
          })
      })
    },
    institutionX(val) {
      return new Promise((resolve, reject) => {
        getXLdata(val)
          .then(response => {
            console.log(response)
            this.control = response.result.events
            this.nodeVOS = response.result.nodeVOS
            this.party = response.result.events
            this.resolution = response.result.situation
            console.log(response)
            resolve(response)
            console.log(response)
          })
          .catch(error => {
            reject(error)
          })
      })
    },
    institutionT(val) {
      return new Promise((resolve, reject) => {
        getTexiang(val)
          .then(response => {
            console.log(response)
            this.control = response.result.safety
            this.nodeVOS = response.result.nodeVOS
            this.party = response.result.safety
            this.resolution = response.result.situation
            console.log(response)
            resolve(response)
            console.log(response)
          })
          .catch(error => {
            reject(error)
          })
      })
    },
    institutionZ(val) {
      return new Promise((resolve, reject) => {
        updataTeli(val)
          .then(response => {
            console.log(response)
            this.control = response.result.events
            console.log(this.control)
            this.nodeVOS = response.result.nodeVo
            this.party = response.result.safety
            // this.resolution = response.result.situation
            resolve(response)
          })
          .catch(error => {
            reject(error)
          })
      })
    },
    filterMultiDictText(dictCode, text) {
      console.log(dictCode, text)
      if (!text && text !== 0) return
      let datas = getDictItemsFromCache(dictCode)
      // return this.$filterMultiDictText(datas, text)
      return this.$filterDictText(datas, text)
    }
  }
}
</script>

<style scoped></style>
